#zd{width:100%;font-size:.32rem;margin:auto;position: relative;}
#index,.community,#user,#mall,.transform_them_a,.m_doc_det,.m_hos_det,.m_brand_zone,.order{padding-bottom:1.2rem;}

.scrollMenu{
  position:fixed;bottom:0;left:0;width: 100%;height:.98rem;background-color: #fff;z-index:888;
  .wrapper{
    display:table;width:100%;background-color: #fff;margin:auto;
    a{
      display:table-cell;width:25%;box-sizing:border-box;text-align: center;height:.98rem;vertical-align: middle;font-size:.18rem;
      color:#c7c7c7;
      .iconfont{font-size:.41rem;margin-bottom:.08rem;color:#c7c7c7;}
      &.active .iconfont,&.active{color:#9c7860}
    }
  }
} //scrollMenu end

#index{
  background-color: #f2f2f2;
  header{background-color:#e4e4e4;overflow:hidden;}
  .head_swiper{
    width:100%;border-top:1px #ebebeb solid;height:4.8rem;
    .swiper-slide{
      width:100%;
      img{width:100%;}
    }
    .swiper-pagination-switch{}
  }
  nav{
    background-color: #fff;
    &:after{border-color:#e4e4e4;}
    .wrapper{
      height:1.6rem;display:table;width:100%;overflow: hidden;
      a{display:table-cell;width:20%;vertical-align: middle;text-align:center;font-size:.18rem;position:relative;z-index: 1;
        div{opacity: 0;transition: all .3s;position: absolute;top:-1.6rem;bottom:0;right:0;left:0;height:1.6rem;
            background: -webkit-gradient(linear, right top, left bottom, from(#fbe0e0),to(#fac4c0));z-index:22;
            display:flex;font-size:.32rem;color:#202020;line-height:1;align-items:center;justify-content: center;
            small{font-size:.14rem;color:#db848c;}
        }
      }
      a.active{
        div{opacity: 1;top:0;}
      }
      img{margin-bottom:.22rem;}
    }
  }
  .container{
    background-color: #fff;margin-top:.24rem;
    .item_wrapper{
      .item{
        .img_show{
          img{width:100%;}
          .border_b1:after{border-color:#fff}
        }
      }
    }
  }


} // #index end


// 蜕变
.toTransform{
  background-color: #f2f2f2;
  nav{width:100%;overflow:hidden;background-color: #fff;
    .wrapper{white-space: nowrap;overflow-x:scroll;padding:.24rem 0;}
    a{
      color:#919191;color:#919191;font-size:.24rem;margin:0 .21rem;padding:.13rem .06rem;position:relative;
      &:before{
        content:"";display:block;position:absolute;width:0;height:0;line-height:0;font-size:0;
        border-bottom: .08rem #202020 solid;left:50%;bottom:0;border-left:.05rem transparent solid;border-right:.05rem transparent solid;
        transform: translate3d(-50%,0,0);opacity:0;transition:all .6s ease;
      }
      &.active:before{
        opacity:1;
      }
      &:after{
        content:'';width:0;height:.03rem;z-index:22;background-color:#202020;position:absolute;left:50%;bottom:-.01rem;transform: translate3d(-50%,0,0);
        opacity:0;transition:all .5s ease;
      }
      &.active:after{
        opacity:1;
        width:100%;
      }
    }
    a.active{color:#2b2b2b;}
  }
}
// 蜕变文章
.art_detail{
  .top{
    padding:0 .4rem;background-color: #fff;overflow: hidden;
    h4{font-weight: normal;color:#202020;font-size:.34rem;font-family:'SimHei';margin:.5rem 0 .4rem;}
    em{display:inline-block;vertical-align: middle;height:.8rem;width:.8rem;background-color: #dcdcdc;border-radius:50%;margin-right:.2rem;}
  }
  .contant{
    background-color: #fff;overflow: hidden;padding-top:.52rem;
    img{width:100%;}
    // .txt{padding:.06rem .4rem .22rem;color:#919191;line-height:.48rem;font-size:.28rem;}
    p{
      margin:.12rem 0;position:relative;color:#919191;line-height:.48rem;font-size:.28rem;
      span{}
    }
    // p:before{content: "\25C6";position: absolute;left:-2em;}
  }
}
::-webkit-scrollbar {
width: 0;
}
.transform_them_a{
  .item_wrapper{background-color:#fff;}
  .txt_list{

  }
}
// 定制
.order{
  .header{
    background-color: #fff;
    img{width:100%}
    .txt_wrapper{
      padding:.52rem .32rem .72rem;
    }
    p{
      text-indent:2em;position:relative;color:#919191;font-size:.28rem;line-height: .48rem;
      &:before{
        content:'◆';position:absolute;left:-2em;
      }
    }
  }
  .order_nav{
    font-size:.24rem;color:#202020;height: .9rem;position: relative;
    .order_nav_wrapper{overflow:hidden;position: absolute;left:0;top:0;width:100%;z-index:2;background-color: #fff;height: .9rem;transition: all .2s;}
    .toggle{
      position: absolute;right:0;top:0;width:.88rem;height: .9rem;z-index: 22;background-color:#fff;box-shadow: 0 0 0.01rem 0.04rem rgba(211,211,211,0.4);display:flex;justify-content: center;align-items: center;
    }
    .toggle[data-state="false"] img{transform: rotateZ(0)}
    .toggle[data-state="true"] img{transform: rotateZ(45deg)}
    .top a.active{color:#9c7860;}
    .all_tit{display:none;overflow:hidden;font-size: .32rem;color:#202020;text-align:center;transition: all .3s;margin-top:0;}
    ul,.all{display:table-cell;}
    ul{overflow:hidden;margin:0;transition: all .2s;}
    .top{
      overflow:hidden;overflow-x:scroll;margin-right:.88rem;height:.9rem;
      .wrapper{width:auto;display:table;}
    }
    ::-webkit-scrollbar {
      width:0;height:0;
    }
    .order_nav_wrapper.active{
      height:auto;
      .top{margin-right:0;height:auto;}
      .all{display:none}
      ul{width:100%;flex-wrap:wrap;display:flex;margin:.58rem 0 .4rem;}
      li{float:left;display:inline;
        a{height:.62rem;line-height: .62rem;}
      }
      .all_tit{display: block;margin-top:.3rem;}
    }
    .all,li a{
      float:left;display:inline;white-space: pre;color:#202020;height:.9rem;box-sizing: border-box;line-height: .9rem;margin:0 .34rem;position:relative;
      &:before{
        content:"";display:block;position:absolute;width:0;height:0;line-height:0;font-size:0;
        border-bottom: .08rem #9c7860 solid;left:50%;bottom:.02rem;border-left:.05rem transparent solid;border-right:.05rem transparent solid;
        transform: translate3d(-50%,0,0);opacity:0;transition:all .4s ease;
      }
      &.active:before{
        opacity:1;
      }
      &:after{
        content:'';width:0;height:.03rem;z-index:22;background-color:#9c7860;position:absolute;left:50%;bottom:-.01rem;transform: translate3d(-50%,0,0);
        opacity:0;transition:all .3s ease;
      }
      &.active:after{
        opacity:1;
        width:100%;
      }
    }
    li{display:table-cell;}

  }
  .contant{
    margin-top:.24rem;background-color: #fff;
    .tit_sty1{
      padding:.5rem 0 .26rem;margin-bottom: .3rem;
    }
    .item_wrapper{
      padding:0 .14rem;
      .item{
        box-shadow: 0 0 .1rem .05rem rgba(228,228,228,.4);display:block;overflow: hidden;margin-bottom:.4rem;background-color: #fff;
        img{width:100%;}
        .txt{
          width:100%;padding:.38rem .24rem .42rem .3rem;display:table;font-size:.2rem;
          .left{width:4.86rem;line-height:1.2;}
          .right{
            text-align:right;
            span{
              display:inline-block;color: #997760;background-color: #efdecc;line-height: .5rem;height: .48rem;border-radius: .3rem;padding: 0 .17rem;
              max-width:100%;
            }
          }

          h4{font-size:.28rem;font-weight:normal;line-height:1.2;}
          small{margin-top:.12rem;color:#919191;}
          &>div{display:table-cell;vertical-align: bottom;}
        }
      }
    }
  }
}


// 共用css
#loading{
  position:fixed;z-index:10000;width:100%;top:0;bottom:0;display:flex;align-items: center;justify-content: center;
  background-color: rgba(255,255,255,0.85);perspective-origin: 50% 0%;perspective:600;
  span{border:.02rem #e2cfc2 solid;width:.8rem;height: .8rem;border-radius: 50%;text-align: center;line-height:.8rem;}
  img{display:inline-block;animation:run_circle 1.2s linear 0s infinite;vertical-align: middle;line-height: .46rem;}
}
//
@keyframes run_circle{
  0%{transform:rotateY(0deg)}
  100%{transform:rotateY(360deg)}
}
.swiper-container{margin:0 auto;position:relative;top:-1px;overflow:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden;z-index:1}
.swiper-wrapper{position:relative;width:100%;-webkit-transition-property:-webkit-transform,left,top;-webkit-transition-duration:0s;-webkit-transform:translate3d(0px,0,0);-webkit-transition-timing-function:ease;-moz-transition-property:-moz-transform,left,top;-moz-transition-duration:0s;-moz-transform:translate3d(0px,0,0);-moz-transition-timing-function:ease;-o-transition-property:-o-transform,left,top;-o-transition-duration:0s;-o-transform:translate3d(0px,0,0);-o-transition-timing-function:ease;-o-transform:translate(0px,0px);-ms-transition-property:-ms-transform,left,top;-ms-transition-duration:0s;-ms-transform:translate3d(0px,0,0);-ms-transition-timing-function:ease;transition-property:transform,left,top;transition-duration:0s;transform:translate3d(0px,0,0);transition-timing-function:ease}
.swiper-free-mode > .swiper-wrapper{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}
.swiper-slide{float:left;}.swiper-wp8-horizontal{-ms-touch-action:pan-y}
.swiper-wp8-vertical{-ms-touch-action:pan-x}
#swiper-container-banner .swiper-slide{float:left;display:inline}
.pagination{position:absolute;left:0;text-align:center;bottom:0.2rem;width:100%;}
.swiper-pagination-switch{
  width:.4rem;height:.4rem;-webkit-transform:scale(0.25,0.25);-webkit-transfrom-origin:50% 100%;display:inline-block;cursor:pointer;font-size:0px;line-height: 0px;vertical-align: middle;
box-shadow:0 0 2px 1px #fff;margin:0 -.1rem;overflow: hidden;box-sizing:border-box;border-radius:999px;background-clip: padding-box;
}
.swiper-active-switch{background:#fff}

.tit_sty1{
  color:#202020;font-size:.34rem;text-align:center;font-family:"SimHei";font-weight:400;padding:.48rem 0 .22rem;margin-bottom:.15rem;border-bottom:1px #e4e4e4 solid;position:relative;
  small{color:#919191;font-size:.2rem;display: inline-block;margin-top:.1rem;font-weight:normal}
  &:after{content:'';width:.1rem;height:.1rem;display: inline-block;border-radius:50%;background-color:#e4e4e4;position:absolute;left:50%;bottom:-.05rem;transform:translate3d(-50%,0,0)}
}

img.arr_right{vertical-align: middle;width:.17rem;position:relative;margin-left:.13rem;transform: translate3d(0,-10%,0)}

// 共用swiper
.common_swiper{
  margin:0 0 .2rem;

  .swiper-slide{
    width:5.72rem;padding-left:.2rem;box-sizing: border-box;position:relative;
    &:before{content:"";position: absolute;z-index:11;left:.2rem;top:0;right:0;bottom:0;background-color: rgba(32,32,32,.26)}
    em{width:1.2rem;height:.89rem;line-height: .6rem;font-size: .28rem;display:block;background:url("../img/index_con_tit_filer.png") 0 0 no-repeat;font-weight: bold;color:#fff;position:absolute;left:.4rem;z-index:22;background-size:100%;text-align:center;}
    .txt{
      position:absolute;z-index: 22;bottom:0;display:block;width:100%;overflow:hidden;left:0;box-sizing: border-box;padding:0 .15rem .14rem .2rem;
      .left{
        float:left;display:inline;position:relative;color:#fff;overflow:hidden;width:100%;padding-left:.16rem;box-sizing:border-box;
        var,small{padding-left:.2rem;font-size:.28rem;height:.3rem;width:100%;line-height:.3rem;box-sizing:border-box;overflow:hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;}
        small{font-size:.2rem;line-height:.22rem;height:.22rem;margin-top:.08rem;display:block;}
        &:before{content:'';display:block;position:absolute;bottom:0;background-color: #997760;width:.06rem;top:0;left:.16;border-radius:30rem;background-clip: content-box;}
      }
      .right{
        float:right;display:inline;color: #997760;font-size:.28rem;background-color:#efdecc;line-height: .5rem;height: .48rem;border-radius:.3rem;padding:0 .17rem;box-sizing:border-box;white-space:nowrap;
        overflow:hidden;text-overflow: ellipsis;-webkit-line-clamp:1;-webkit-box-orient:vertical;
      }
    }
  }
  img{width:100%;height:3.6rem}
}

.mask{position:relative;z-index:1;}
.mask>span{z-index:1;}
.mask>h4{z-index:3;}
.mask>p{z-index:3;}
.mask:before{content:"";z-index:2;display:block;position:absolute;left:0;top:0;width:100%;bottom:0;background-color: rgba(32,32,32,.26)}
.txt_ellip{overflow:hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;}
// 共用item
.common_item{
  display:table;width:100%;padding:.55rem 0 .51rem;background-color:#fff;
  &>div{display:table-cell;vertical-align: top;}
  .left{
    width:2.55rem;overflow:hidden;
    em{display:inline-block;width:2rem;height:2rem;background-size: contain;background-repeat: no-repeat;background-position: center center;}
    img,em{box-shadow:0 0 .26rem .01rem #e4e4e4;margin-left:.2rem;}
  }
  .right{
    position:relative;
    h4{font-size:.26rem;line-height:.34rem;height:.68rem;width:90%;font-weight:normal;
      span img{line-height: 1;transform: translate3d(0,-10%,0)}
    }
    p{font-size:.24rem;color:#919191;line-height:.36rem;margin-top:.12rem;height:.72rem;width:100%;
      display:-webkit-box;overflow:hidden;text-overflow: ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;
      img{transform: translate3d(0,10%,0)}
    }
    .shop_car{
      box-sizing: border-box;position:absolute;right:.5rem;bottom:.45rem;width:.6rem;height:.6rem;border:.02rem solid #997760;display:flex;align-items:center;justify-content:center;border-radius:50%;
      i{font-size:.36rem;}
      i:before{vertical-align: baseline;}
      em{
        position:absolute;width:.22rem;height:.22rem;right:-0.05rem;top:-0.08rem;background-color: #ff1a50;border-radius: 50%;font-size:.2rem;color:#fff;text-align:center;line-height:.22rem;
      }
    }
    .price{
      display:inline-block;position: relative;vertical-align: text-bottom;margin-top:.15rem;color:#997760;overflow: hidden;line-height:.3rem;background-color:#efdecc;width:2rem;box-sizing:border-box;padding:.05rem .15rem;border-radius:25rem;
      span{font-size:.26rem;height:.26rem;line-height:.26rem;}
    }
    .o_price{display:inline-block;line-height:.4rem;color:#919191;font-size:.24rem;display:inline-block;margin-left:.3rem;}
  }
}
.common_list{
  padding:.64rem 0 .5rem;display:table;width:100%;
  &>div{display:table-cell;vertical-align: top}
  .left{width:2.55rem;box-sizing:border-box;padding-left: .2rem;
    img{box-shadow:0 0 .2rem .1rem rgba(145,145,145,0.2);}
  }
  .right{
    .top{
      line-height: .32rem;color:#919191;font-size:.24rem;box-sizing: border-box;padding-right:.36rem;
      em{display: inline-block;width:.3rem;height:.3rem;background-color: #9c7860;border-radius: 50%;overflow:hidden;vertical-align: middle;margin-right:.1rem;}
      var{float:left;display:inline;}
      .last_time{float:right;display:inline;}
    }
    h4{color:#202020;font-size:.32rem;box-sizing: border-box;padding-right:.36rem;font-weight:normal;height:.72rem;line-height:.36rem;margin-top:.24rem;color:#202020;font-family:'SimHei';overflow:hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
    .bot{
      margin-top:.25rem;
      &>*{display:inline-block;font-size:.2rem;}
      var{height:.48rem;color:#997760;padding:0 .19rem;border-radius:.3rem;border:.02rem solid #efdecc;line-height:.44rem;box-sizing:border-box;}
      em{color:#919191;margin-left:.28rem;}
    }
  }
}
@media screen and (max-width:360px){
  .common_item .right .price span{top:1px;}
  .m_serv_det header .info .price span{top:1px;}
  .m_serv_det .contant .scroll_menu .wrapper a:after{height:2px;bottom:-1px;}
  .m_serv_det .contant .scroll_menu .wrapper a:before{border-bottom-width: 5px;border-left-width: 4px;border-right-width: 4px;}
  .common_item .right .shop_car{border-width: 2px;}
  .m_doc_det .professional .wrapper em{padding:2px;}
  .m_serv_det .contant .item_wrapper .wrapper em,
  .m_serv_det .contant .item_wrapper .wrapper var,
  .m_doc_det .professional .wrapper em,
  .m_doc_det .professional .wrapper var,
  .u_shop_car .item .ctr span,
  .u_shop_car .item .ctr a,
  .applyRefund .cause li em.checks var,
  .hasCheck .item .wrapper:before,
  .hasCheck .item .wrapper em.checks var,
  .fix_total .top em,
  .pay .item em,
  .userLogin .inp1, .userLogin .inp2,
  #loading span,
  .u_shop_car .item .ctr span var{border-width:1px!important;}
}

//共用悬浮电话
.fix_tel{
  position:fixed;z-index:888;bottom:0;left:0;height:1.18rem;display:flex;justify-content:center;align-items:center;background-color: #fff;width:100%;
  a{
    width:100%;margin:0 .35rem;background-color:#f7e5e4;height:.72rem;line-height:.72rem;text-align: center;border-radius:25rem;
    color:#9c7860;font-size:.28rem;
  }
}
// 购物车 结算
.fix_total{
  position:fixed!important;z-index:888;bottom:0;left:0;width:100%;background-color: #fff;color:#9c7860;font-size:.28rem;padding:.3rem .35rem .22rem;
  .top{
    display:flex;justify-content:space-between;line-height: .28rem;margin-bottom:.25rem;
    em,var{width:.6rem;height:.6rem;transform:scale(0.5,0.5);transform-origin: 0% 41%;display:inline-block;border-radius: 50%;vertical-align: middle;box-sizing:border-box;border:.02rem #9c7860 solid;}
    var{border:none;background-color:#9c7860}
  }
  span.active em{
    background:url("../img/duihao.png") 0 0 no-repeat;background-size:cover;
  }
  a{display:block;width: 100%;height:.72rem;background-color: #f7e5e4;color:#9c7860;line-height: .72rem;text-align:center;border-radius:25rem;}
}
// 共用悬浮加入购物车、立即购买
.fixed_b_menu{
  position:fixed;z-index:888;z-index:888;bottom:0;left:0;height:2.02rem;background-color:#fff;width:100%;color:#9c7860;font-size:.28rem;padding:.36rem .34rem .22rem;
  .menu{
    display:flex;justify-content:space-between;width:100%;margin-top:.44rem;
    a{width:3.2rem;position:relative;height:.72rem;border-radius: 25rem;background-color: #efdecc;text-align:center;line-height:.72rem;}
    a:last-child{background-color: #202020;color:#fff;}
    .add_shopcar em,.add_shopcar var{display: inline-block;position:absolute;right:10%;top:0;width:4rem;height:4rem;line-height:4rem;transform: translate3d(0,-3%,0) scale(.1);transform-origin:100% 0%;font-size:2rem;background-color:#f95d5d;color:#fff;border-radius:50%;}
  }
}
